import { Component, inject } from '@angular/core';
import { RouterOutlet } from '@angular/router';
import { DesktopService } from '../service/desktop.service';
import { HostListener } from '@angular/core';
import { ControlService } from '../service/control.service';
import { SettingComponent } from './components/setting/setting.component';

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [RouterOutlet, SettingComponent],
  templateUrl: './app.component.html',
  styleUrl: './app.component.less'
})
export class AppComponent {
  is_control = false;
  screen: string = ''
  connected = false;
  desktop_service = inject(DesktopService);
  control_service = inject(ControlService);
  // @HostListener('window:keydown', ['$event'])
  // handleKeydownEvent(event: KeyboardEvent) {
  //   this.control_service.on_key_event(event);
  // }
  // @HostListener('window:keyup', ['$event'])
  // handleKeyupEvent(event: KeyboardEvent) {
  //   this.control_service.on_key_event(event);
  // }

  // @HostListener('window:mousemove', ['$event'])
  // handleMousemoveEvent(event: MouseEvent) {
  //   let id = (event.target as any).id;
  //   if (id == "screen") {
  //     this.control_service.on_mouse_event(event);
  //   }
  // }

  // @HostListener('window:mousedown', ['$event'])
  // handleMousedownEvent(event: MouseEvent) {
  //   let id = (event.target as any).id;
  //   console.log("鼠标点击事件", event)
  //   if (id == "screen") {
  //     this.control_service.on_mouse_event(event);
  //   }
  // }
  // @HostListener('window:mouseup', ['$event'])
  // handleMouseupEvent(event: MouseEvent) {
  //   let id = (event.target as any).id;
  //   if (id == "screen") {
  //     this.control_service.on_mouse_event(event);
  //   }
  // }
  // @HostListener('mousewheel', ['$event'])
  // handleMousewheelEvent(event: WheelEvent) {
  //   let id = (event.target as any).id;
  //   console.log("鼠标滚轮事件", event)
  //   if (id == "screen") {
  //     this.control_service.on_mouse_event(event);
  //   }
  // }

  server: string = "114.132.201.209:30001";

  constructor() {
    this.desktop_service.init(`ws://${this.server}/socket/desktop?width=2560&height=1440&quality=50`);
    // this.control_service.init(`ws://${this.server}/socket/control`);
  }

  ngOnInit() {
    this.desktop_service.on_refresh_screen.subscribe(res => {
      this.screen = URL.createObjectURL(res);
    });
    this.control_service.on_screen_info.subscribe(res => {
      console.log("屏幕信息", res)
    })

    let ticker = setInterval(() => {
      if (this.control_service.is_init) {
        this.control_service.get_screen_info();
        clearInterval(ticker);
      }
    }, 1000);
  }

}
